<script>
import { auditApply, finance } from '../api';

export default {
  name: 'agree-refuse-withdraw',
  data() {
    return {
      // 拒绝理由
      note: ''
    };
  },
  props: {
    value: {
      type: Boolean,
      default: false
    },
    info: {
      type: [Object]
    },
    type: {
      type: String
    }
  },
  computed: {
    showDialog: {
      get({ value }) {
        return value;
      },
      set(value) {
        this.$emit('input', value);
      }
    },
    // 表单信息
    applyContent({ info }) {
      return info.apply_content;
    }
  },
  render() {
    const self = this;
    return (
      <el-dialog
        class="le-form"
        visible={self.showDialog}
        title="提现申请"
        width={self.type === 'agree' ? '376px' : '496px'}
        on={{
          ['update:visible']: e => {
            self.showDialog = e;
          }
        }}>
        <el-form label-width="136px">
          <el-form-item label="申请提现金额">￥{self.info.price}</el-form-item>
          <el-form-item label="手续费">￥{self.info.service_charge}</el-form-item>
          <el-form-item label="实际打款金额">￥{self.info.actual_price}</el-form-item>
          {(() => {
            if (self.type === 'refuse') {
              return (
                <el-form-item label="拒绝理由">
                  <el-input
                    type="textarea"
                    v-model={self.note}
                    rows="8"
                    class="le-input--280"
                    placeholder="请输入拒绝理由"
                    resize="none"
                    maxlength="200"
                    show-word-limit={true}
                  />
                </el-form-item>
              );
            }
          })()}
        </el-form>
        <div slot="footer">
          <el-button onClick={() => (self.showDialog = false)}>取消</el-button>
          <el-button type="primary" onClick={self.submit}>
            {self.type === 'refuse' ? '拒绝' : self.type === 'agree' ? '同意申请' : ''}
          </el-button>
        </div>
      </el-dialog>
    );
  },
  methods: {
    submit() {
      let success = '';
      let data = '';
      let status = null;
      if (this.type === 'refuse') {
        success = '拒绝提现申请成功';
        data = this.note;
        status = 3;
      } else if (this.type === 'agree') {
        success = '通过提现申请成功';
        status = 1;
      }
      finance(this.info.id, status, data).then(() => {
        this.showDialog = false;
        this.$message.success(success);
        this.info.status = status;
        this.$emit('update:info', this.info);
        this.$emit('confirm');
      });
    }
  }
};
</script>

<style scoped lang="less">
@import './../index.less';

.le-form {
  /deep/ .el-form-item__content:extend(.font-family-yahei) {
    font-size: 14px;
    font-weight: 400;
    color: #262626;
  }

  /deep/ .el-dialog__body {
    padding-bottom: 0;
  }

  /deep/ .el-dialog__footer {
    padding-bottom: 40px;
  }
}

.le-icon-wehcat,
.le-icon-xiaochengxu {
  font-size: 16px;
  margin-right: 8px;
}

.apply-value:extend(.font-family-yahei) {
  font-size: 14px;
  font-weight: 400;
  color: #262626;
}
</style>
